Skip to content

Add streams screen UI with data table#185

Closed
ekumamatthew wants to merge 2 commits intoLabsCrypt:mainfrom
ekumamatthew:streams-screen-ui
Closed

Add streams screen UI with data table#185
ekumamatthew wants to merge 2 commits intoLabsCrypt:mainfrom
ekumamatthew:streams-screen-ui

Conversation

@ekumamatthew
Copy link
Copy Markdown

  • Create OutgoingStreams component with mock data
  • Add table displaying Recipient, Token, Rate, Remaining Balance
  • Include Cancel and Modify button actions
  • Add pause/resume functionality for streams
  • Create reusable UI components (table, badge, card extensions)
  • Update app page to show streams screen

tthis resolves Issue Closes #71

- Create OutgoingStreams component with mock data
- Add table displaying Recipient, Token, Rate, Remaining Balance
- Include Cancel and Modify button actions
- Add pause/resume functionality for streams
- Create reusable UI components (table, badge, card extensions)
- Update app page to show streams screen

Acceptance Criteria:
✓ Data Table displaying: Recipient, Token, Rate, Remaining Balance
✓ 'Cancel' button action column
✓ 'Modify' button action column
Copy link
Copy Markdown
Contributor

@ogazboiz ogazboiz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hey, thanks for the PR!

we noticed the mock data or implementation uses Ethereum addresses (0x...), but FlowFi is built on Stellar, which uses addresses starting with G.... could you update the mock data and any related UI validation to use the Stellar account format?

also, the CI checks are currently failing and there are merge conflicts with main. could you pull the latest changes, resolve the conflicts, and check the workflow logs to fix the failing steps?

once that's sorted let us know and we'll take another look — happy to help if you get stuck! if you want to contribute more or follow up if issues are open, join us on Telegram: https://t.me/+DOylgFv1jyJlNzM0

Copy link
Copy Markdown
Contributor

@ogazboiz ogazboiz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hey, thanks for the contribution!

To ensure your Pull Request passes the CI pipeline and maintains repository stability, please follow these technical requirements:

1. Backend Testing (Vitest)

  • Version: We have standardized on Vitest ^2.1.8. Do not upgrade to v3 or v4 without explicit approval, as they introduce native dependency issues in the CI environment.
  • Isolation: Each test file now runs in its own forked process (pool: 'forks'). This prevents vi.mock() and other module-level states from leaking between files.
  • Prisma Mocking: When testing controllers, always mock the Prisma client in backend/src/lib/prisma.ts. Do not rely on a real database for unit tests.
  • CLI Flags: Avoid using the --verbose flag in Vitest commands, as it is incompatible with the v2 CLI.

2. API Versioning & Routing

  • Endpoints: Hit versioned endpoints (e.g., /v1/streams) instead of the deprecated root endpoints (e.g., /streams).
  • Response Codes: Endpoints return 410 Gone for specifically deprecated routes. Ensure your tests handle these correctly.
  • Input Validation: Controllers expect strict field names (e.g., streamId, ratePerSecond, depositedAmount). Use the types defined in src/services/ and src/controllers/.

3. Infrastructure & Dependencies

  • Husky: The pipeline skips Husky. Your package.json scripts should use husky || true to prevent non-interactive shell failures.
  • Prisma Generation: Always ensure your workflow runs prisma generate before tests. The CI now handles this in a consolidated "Setup Database" step.
  • Native Bindings: If you add dependencies with native bindings (like Rollup or ESBuild), ensure they are compatible with the ubuntu-latest (linux-x64) runner.

4. Frontend Best Practices

  • Directives: Always include "use client" at the top of components that utilize React hooks or browser APIs.
  • Dependencies: Ensure all utilized libraries (like react-hot-toast) are explicitly added to frontend/package.json and not just inherited from the root.

Please make sure your CI passes before we finalize the merge. Let us know if you have any questions!

If you want to follow up or have questions, join us on Telegram: https://t.me/+DOylgFv1jyJlNzM0

Copy link
Copy Markdown
Contributor

@ogazboiz ogazboiz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hey, just checking in on this again — still waiting on those updates to fix the CI based on our last comment. no rush if you're busy, just let us know if you plan to continue with it or if we should close it for now!

if you want to contribute more or follow up if issues are open, join us on Telegram: https://t.me/+DOylgFv1jyJlNzM0

@ekumamatthew
Copy link
Copy Markdown
Author

Hi . I'll make fix to that .. had lil-issues With my pc and its been fixed at a shop currently

@ogazboiz
Copy link
Copy Markdown
Contributor

closing this due to no progress — totally understand the PC issues! feel free to reopen when you're back. the main things to fix: replace Ethereum addresses with Stellar public keys in the mock data, resolve the merge conflicts, and get CI passing. happy to re-review once those are sorted. join us on Telegram: https://t.me/+DOylgFv1jyJlNzM0

@ogazboiz ogazboiz closed this Mar 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Frontend: Outgoing Streams Screen

2 participants